<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:f="http://xmlns.jcp.org/jsf/core">

    <ui:composition template="/WEB-INF/content/layout.xhtml">
        <ui:define name="style">
<style>

table.table {
	table-layout: fixed;
	text-align: center;
	font-size: xx-large;
	font-family: monospace;
}

table.table table {
    line-height: 1;
    table-layout: fixed;
    font-size: x-small;
}

table.table td {
    padding: 0em;
}

td.even {
	background-color: gray;
}

td.odd {
    background-color: DimGray;
}

td.error {
    background-color: red;
}

td.row, td.col, td.box {
    background-color: blue;
}

td.reference {
    font-weight: bold;
    color: aqua;
}

td.removed {
    font-weight: bold;
    color: fuchsia;
    text-decoration: line-through;
}

</style>
        </ui:define>
        <ui:define name="script">

<script src="/content/sudoku.js" />

        </ui:define>
        <ui:define name="title">${msg['menu.client.sudoku']}</ui:define>
        <ui:define name="content">

<input id="text" onkeyup="createTable()" />
<button onclick="solve()">Solve</button>
<div id="loader" />

        </ui:define>
    </ui:composition>

</html>
